import { Search, Globe } from 'lucide-react'

const ChatArea = () => {
  return (
    <div className="flex-1 flex flex-col">
      {/* 聊天消息展示区 */}
      <div className="flex-1 overflow-y-auto p-6">
        {/* AI欢迎消息 */}
        <div className="flex items-start gap-4 mb-6">
          <div className="w-8 h-8 rounded-full bg-blue-500 flex items-center justify-center">
            <span className="text-white text-sm">AI</span>
          </div>
          <div>
            <h2 className="text-lg font-medium mb-2">很高兴见到你！</h2>
            <p className="text-gray-600">
              我可以帮你写代码、读文件、写作各种创意内容，请把你的任务交给我吧~
            </p>
          </div>
        </div>
      </div>

      {/* 底部输入区域 */}
      <div className="border-t border-gray-200 p-4">
        <div className="relative">
          <textarea
            placeholder="给 DeepSeek 发送消息"
            className="w-full pl-4 pr-24 py-3 border rounded-lg focus:outline-none focus:border-blue-500 resize-none h-[52px]"
            rows={1}
          />
          <div className="absolute right-2 top-2 flex gap-2">
            <button className="p-2 hover:bg-gray-100 rounded-lg" title="深度搜索">
              <Search className="h-5 w-5 text-gray-500" />
            </button>
            <button className="p-2 hover:bg-gray-100 rounded-lg" title="联网搜索">
              <Globe className="h-5 w-5 text-gray-500" />
            </button>
          </div>
        </div>
      </div>
    </div>
  )
} 

export default ChatArea; 